<template>
    <div class="img-div">
        <el-image :src="require('@/common/image/folder.png')" v-show="folder == 2"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/video.png')" v-show="filename == 1 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/mp3.png')" v-show="filename == 2 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/img.png')" v-show="filename == 3 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/pdf.png')" v-show="filename == 4 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/word.png')" v-show="filename == 5 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/excel.png')" v-show="filename == 6 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/txt.png')" v-show="filename == 7 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/code.png')" v-show="filename == 8 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/zip.png')" v-show="filename == 9 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/ppt.png')" v-show="filename == 10 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <el-image :src="require('@/common/image/other.png')" v-show="filename == 11 && folder == 1"
            :style="'width:' + size + 'px;height:' + size + 'px'"></el-image>
        <!-- <el-image :src="require('@/common/image/zip.png')"></el-image>
        <el-image :src="require('@/common/image/zip.png')"></el-image>
        <el-image :src="require('@/common/image/zip.png')"></el-image>
        <el-image :src="require('@/common/image/zip.png')"></el-image> -->
    </div>
</template>

<script>
export default {
    name: "my-file-img",
    props: ['filename', 'size', "folder"],
}
</script>

<style scoped>
.img-div{
    display: flex;
    align-items: center;
    justify-content: center;
}
</style>